<template>
  <div class="box">
    <div class="top">
      <span class="iconfont icon-chevron-thin-left" @click="getlog()"></span>
      <b>添加收货地址</b>
    </div>
    <div>
      <van-address-edit
        :area-list="areaList"
        :show-postal="false"
        :show-delete="true"
        show-set-default
        show-search-result
        :search-result="searchResult"
        @save="onSave"
        @delete="onDelete"
        @change-detail="onChangeDetail"
        :address-info="this.num1"
      />
      <!-- :area-columns-placeholder="['请选择', '请选择', '请选择']" -->
    </div>
  </div>
</template>
<script>
import * as API from "@/components/api/hanjinqi.js";
import area from "../../area.json";
export default {
  data() {
    return {
      areaList: area,
      searchResult: [],
    };
  },
  // 生命周期 - 挂载完成（访问DOM元素）
  mounted() {
    // console.log(this.num1);
  },
  methods: {
    //点击返回上一页
    getlog() {
      this.$router.go(-1);
    },
    // 点击保存
    async onSave(content) {
      //   addressDetail: "杭州市西湖区 黄龙万科中心";
      //   areaCode: "110101";
      //   city: "北京市";
      //   country: "";
      //   county: "东城区";
      //   isDefault: false;
      //   name: "1111";
      //   postalCode: "";
      //   province: "北京市";
      //   tel: "13230087819";
      console.log(content);
      if (this.num1 === undefined) {
        await API.honSave({
          date: content,
          uid: JSON.parse(localStorage.getItem("token")).uid,
        });
        this.$router.go(-1);
      } else {
        await API.honSave({
          date: content,
          uid: JSON.parse(localStorage.getItem("token")).uid,
          id: content.id,
        });
        this.$router.go(-1);
      }
    },
    // 点击删除
    async onDelete(content) {
      // console.log(content);
      await API.honSave({
        date:content,
        uid: JSON.parse(localStorage.getItem("token")).uid,
        id: content.id,
        type: true,
      });
      this.$router.go(-1);
    },
    onChangeDetail(val) {},
  },
  computed: {
    num1() {
      return this.$route.query.plan;
    },
  },
};
</script>

<style scoped>
.box {
  width: 100%;
  /* height: 830px; */
  height: 100vh;
  z-index: 666;
  position: fixed;
  left: 0;
  top: 0;
  background: #f3f3f3;
}
.box .top {
  width: 100%;
  height: 4rem;
}
.top span {
  width: 6%;
  float: left;
  line-height: 4rem;
  margin-left: 0.3rem;
}
.top b {
  /* margin-left: 0.5rem; */
  line-height: 4rem;
  font-weight: 600;
}
</style>